<template>
    <el-form :model="loginForm" label-width="auto" style="text-align: center; margin-left: 40%;margin-top: 15%;" v-if="ShowLoginPanel" >
    <el-form-item label="账号:" style="text-align: center;">
      <el-input v-model="loginForm.accountInput" style="width: 240px" placeholder="输入用户名或账号"/>
    </el-form-item>
    <el-form-item label="密码:" style="text-align: center;">
      <el-input v-model="loginForm.pwdInput" style="width: 240px" placeholder="输入密码" type="password"/>
    </el-form-item>
    <el-form-item style="text-align: center;">
      <el-button type="primary" plain @click="clearInput" style="margin-right: 72px; width: 100px;">重置</el-button>
      <el-button type="primary" @click="onLoginClick" style="width: 100px;">登录</el-button>
    </el-form-item>
  </el-form>
</template>

<script>
import { LoginComponent } from '@vue/composition-api'

export default LoginComponent({
    data(){
        return{
            loginForm:{
            accountInput: '',
            pwdInput: ''
            },
        }
    },

    methods: {
        onLoginClick(){
        this.stopFlv();

        const account = this.loginForm.accountInput;
        const pwd = this.loginForm.pwdInput;

        const url = "http://localhost:9998/login?account=" + account + "&password=" + pwd;
        axios.get(url).then(res => {
            const JsonReturn = JSON.parse(JSON.stringify(res.data));
            if(JsonReturn.Status === 0){
            //set cookie
            if(cookies.isKey('cookie')){
                cookies.remove("cookie");
            }
            cookies.set('cookie', JsonReturn.Cookie);

            //get permission
            const permissionUrl = "http://localhost:9998/api/allPermission?cookie=" + cookies.get('cookie');
            axios.get(permissionUrl).then(res => {
                const JsonReturn = JSON.parse(JSON.stringify(res.data));
                if(JsonReturn.Status === 0){
                this.ShowLoginPanel=false;
                this.ShowMainPanel=true;
                if(JsonReturn.DeleteFile || JsonReturn.DownloadFile || JsonReturn.UploadFile){
                    this.FileManagerButton=true;
                }
                if(JsonReturn.RemoteControl){
                    this.ScreenStreamButton=true;
                }
                if(JsonReturn.Root){
                    this.UserManagerButton=true;
                }
                }
                else{
                this.ShowLoginPanel=true;
                this.ShowMainPanel=false;
                }
            });
            }
            else if(JsonReturn.Status === 1){
            this.showNotice('服务器无响应', 'Error', 'error');
            }
            else if(JsonReturn.Status === 2){
            this.showNotice('密码错误', 'Error', 'error');
            }
        });
        },
    }
})
</script>
